/* =============================================================================

	STYLE.CSS
	version: 1.6
	updated: 2009-03-06, 13:00 GMT+1

============================================================================= */

* {margin:0; padding:0;}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {border:0; outline:0; vertical-align:baseline; background:transparent;}
.hidden {position:absolute; left:-1000em; top:-1000em; width:1px; height:1px; overflow:hidden;}
.noscreen {display:none;}
.box {min-height:1px;}
.box:after {display:block; visibility:hidden; clear:both; line-height:0; font-size:0; content:".";}
.fix {float:none; clear:both; width:0; height:0; margin:0; padding:0; border:0; line-height:0; font-size:0;}
.f-left {float:left !important;}
.f-right {float:right !important;}
.t-left {text-align:left !important;}
.t-center {text-align:center !important;}
.t-right {text-align:right !important;}
.t-justify {text-align:justify !important;}
.va-top {vertical-align:top !important;}
.va-middle {vertical-align:middle !important;}
.va-bottom {vertical-align:bottom !important;}
.nom {margin:0 !important;}
.nomt {margin-top:0 !important;}
.nomb {margin-bottom:0 !important;}


body {background-color:#eaeaea; color:#303030; font:0.8em/1.5 "arial", sans-serif;}
a {color:#0085cc;}
a:hover, a:active, a:focus {color:#df0000;}
#content h2 {color:#0085cc;}
#content table {border:2px solid #cfcfcf;}
#content table th {border-right:1px solid #0074B3; background-color:#0085cc; color:#fff;}
#content table td {border:1px solid #cfcfcf;}
#content table tr.bg td {background-color:#e8f6ff;}
#content dl dt {color:#df0000;}
#content fieldset {border:1px solid #ccc;}
#content legend {background:#FFF; color:#0085cc;}
#content acronym, #content abbr, #content .help {border-bottom:1px dotted #cfcfcf;}

/* =============================================================================
HTML - without styles
============================================================================= */

table.nostyle th, dl.nostyle dt {color:#303030 !important;}

/* =============================================================================
LAYOUT
============================================================================= */

#tray {background-color:#303030; color:#cfcfcf;}
#tray a, #tray strong {color:#fff;}
#tray a:hover, #tray a:active, #tray a:focus {color:#b4e3ff;}
#menu {background-color:#0085cc;}
#menu ul li a {background-color:#fff; color:#303030;}
#menu ul li a span {background-color:#FFF;}
#menu ul li a:hover, #menu ul li a:active, #menu ul li a:focus, #menu ul li#menu-active a {background-color:#FFF; color:#df0000;}
#menu ul li a:hover span, #menu ul li#menu-active a span {background-color:#FFF;}
#menu ul li#menu-active a {color:#0085cc;}
#menu ul.f-right a {color:#df0000;}
#content {border:1px solid #afafaf; background:#fff;}
#footer {color:#707070;}
#footer a {color:#707070;}
#footer a:hover, #footer a:active, #footer a:focus {color:#303030;}



/* =============================================================================
MESSAGES
============================================================================= */

.msg.warning {border:2px solid #F2DD8C; background-color:#FFF5CC;}
.msg.warning a {color:#df0000;} .msg.warning a:hover, .msg.warning a:active, .msg.warning a:focus {color:#303030;}
.msg.info {border:2px solid #B8E2FB; background-color:#E8F6FF;}
.msg.done {border:2px solid #BBDF8D; background-color:#EAF7D9;}
.msg.error {border:2px solid #FFAEAE; background-color:#FEEBEB;}

/* =============================================================================

	RESET.CSS
	version: 1.0
	updated: 2009-02-02, 11:47 GMT+1

============================================================================= */

/* =============================================================================
RESET
============================================================================= */

/* =============================================================================

	MAIN.CSS
	version: 1.7
	updated: 2009-03-14, 12:44 GMT+1

============================================================================= */

/* =============================================================================
HTML - styles
============================================================================= */

h1, h2, h3, h4, h5, h6, address, blockquote, dl, fieldset, ol, p, table, ul {margin:15px 0;}
#content h1 {font-size:180%;}
#content h2 {font-size:160%;}
#content h3 {font-size:140%;}
#content h4 {font-size:120%;}
#content h5, h6 {font-size:100%;}
#content table {margin:0; border-collapse:collapse;}
#content table.width100 {width:100%;}
#content table th, #content table td {padding:5px 5px;}
#content table th {text-align:left; vertical-align:middle; font-weight:bold;}
#content ul {margin:15px 0; list-style:none;}
#content ul li {padding-left:15px; background:url("../image/ul.gif") 0 4px no-repeat;}
#content ul ul {margin:0 0 0 10px;}
#content ul ul li {padding-left:15px; background:url("../image/ul-ul.gif") 0 4px no-repeat;}
#content ol {margin:15px 0 15px 30px; list-style-type:decimal;}
#content ol ol {margin:0 0 0 20px;}
#content ol ol li {list-style-type:lower-alpha;}
#content dl {clear:both;}
#content dl dt {font-weight:bold;}
#content dl dd {margin:0 0 5px 0;}
#content fieldset {position:relative; margin:10px 0; padding:10px;}
#content legend {font-size:120%; font-weight:bold;}
#content code {font-family:"",monospace;}
#content .help {cursor:help;}

/* =============================================================================
HTML - without styles
============================================================================= */

table.nostyle, table.nostyle th, table.nostyle td {border:0 !important;}
table.nostyle th {background:none !important; text-align:left !important;}
table.nostyle th, table.nostyle td {padding:3px 5px !important;}
ul.nostyle {margin:15px 0 15px 20px !important; list-style-type:square !important;}
ul.nostyle ul {margin:0 0 0 25px !important; list-style-type:square !important;}
ul.nostyle li {padding:0 !important; background:none !important;}
dl.nostyle dt {font-weight:bold !important;}
dl.nostyle dd {margin:0 !important;}

/* =============================================================================
LAYOUT
============================================================================= */

#main {min-width:980px; width:expression(document.body.clientWidth < 980? "980px" : "auto" );}
#tray {padding:12px 15px; background:url("../image/tray.gif") 0 0 repeat-x; font:85%/1.2 "tahoma",sans-serif;}
#tray p {margin:0;}
#tray p.f-left {width:50%;}
#tray #logout {padding-left:18px; background:url("../image/tray-logout.gif") 0 50% no-repeat; text-transform:uppercase;}
#tray #switcher {margin-right:15px;}
#tray #switcher img {display:block; float:left; width:16px; height:16px; border:0;}
#menu {padding:15px 15px 13px 15px; background:url("../image/menu.gif") 0 0 repeat-x;}
#menu ul {margin:0; padding:0; list-style-type:none;}
#menu ul li {display:inline; margin:0; padding:0;}
#menu ul li a {float:left; margin-right:5px; padding-left:5px; background:url("../image/menu-left.gif") 0 0 no-repeat; text-decoration:none; cursor:pointer;}
#menu ul li a span {float:left; display:block; padding:7px 15px 9px 8px; background:url("../image/menu-right.gif") 100% 0 no-repeat;}
#menu ul li a:hover, #menu ul li#menu-active a {background:url("../image/menu-left.gif") 0 -35px no-repeat;}
#menu ul li a:hover span, #menu ul li#menu-active a span {background:url("../image/menu-right.gif") 100% -35px no-repeat;}
#menu ul li#menu-active a {font-weight:bold;}
#content {padding:20px; overflow:hidden;}
#footer {clear:both; padding:15px; background:url("../image/separator.gif") 0 0 repeat-x; font:85%/1.2 "tahoma",sans-serif;}
#footer p {margin:0;}

#content h1 {background-color:#303030; color:#fff;}
#content .tabs {border-bottom:1px solid #cfcfcf;}
#content .tabs a {color:#303030;}
#content .tabs a span {color:#303030;}
#content .tabs .ui-tabs-selected a {color:#fff;}
#content .tabs .ui-tabs-selected a span {color:#fff;}
.high {color:#df0000;}
.high-bg {background:#FFB;}
.low {color:#707070;}

#content h1 {margin:0; padding:10px 15px; background:url("../image/content-h1.gif") 0 0 repeat-x; letter-spacing:-1px;}
#content .col50 {float:left; width:49%;}
#content .col33 {float:left; width:32%;}
#content .col33.center {padding:0 2%;}
#content .tabs {margin:15px 0;}
#content .tabs ul {margin:0; padding:0; list-style-type:none;}
#content .tabs ul li {display:inline; margin:0; padding:0;}
#content .tabs a {float:left; margin-right:3px; padding-left:4px; background:url("../image/tabs-l.gif") 0 -100px no-repeat; text-decoration:none;}
#content .tabs a span {float:left; display:block; padding:8px 15px 6px 11px; background:url("../image/tabs-r.gif") 100% -100px no-repeat;}
#content .tabs a:hover, .tabs a:hover span {text-decoration:underline;}
#content .tabs .ui-tabs-selected a {background:url("../image/tabs-l.gif") 0 0 no-repeat; font-weight:bold;}
#content .tabs .ui-tabs-selected a span  {background:url("../image/tabs-r.gif") 100% 0 no-repeat;}
#content .tabs .ui-tabs-selected a:hover, #content .tabs .ui-tabs-selected a:hover span {text-decoration:none;}
#content .ui-tabs-hide {display: none !important;}
.input-text {padding:3px; font:100%/1.5 "arial", sans-serif; 1px solid #AFAFAF; width:200px}
.input-text-02 {padding:5px; font:140%/1.5 "arial", sans-serif;}
.input-submit {padding:5px; font-size:120%;}
.input-submit-02 {padding:1px; font-size:100%;}
.msg {padding:10px; padding-left:35px;}
.msg.warning {background:url("../image/ico-warning.gif") 10px 50% no-repeat;}
.msg.info {background:url("../image/ico-info.gif") 10px 50% no-repeat;}
.msg.done {background:url("../image/ico-done.gif") 10px 50% no-repeat;}
.msg.error {background:url("../image/ico-delete.gif") 10px 50% no-repeat;}

/* =============================================================================
FONT STYLES
============================================================================= */

.bigger {font-size:120%;}
.smaller {font:85%/1.2 "tahoma",sans-serif;}

/* This line can be deleted */
.tit {padding:8px; background:#d7e2e8;} .tag {background:#ffa;}

/* WRITE YOUR CSS CODE HERE */
.left-col {
        margin:0 0 10px 10px;
        padding:2px; 
        border:1px solid #BFBFBF;
        background-color:#FFFFFF;
 }
.left-col h2{
    line-height: 33px;
    background-color:#CEE3F6;   
    background:url(../image/h2-bg-1x37.gif);
    padding:1px 0 4px 10px; 
    margin:0px;
    color:#434945;
    font-size:18px;
}

.left-info{
    list-style:none; 
    padding:4px 4px 4px 10px; 
    margin-top:0px;
}

.left-info li{
    padding:6px 0;
    border-bottom: 1px solid #DBE5EA;
}


.right-col {
        height:220px; 
        min-height:220px; 
        margin:10px 0 10px 0;
        border:0px solid #BFBFBF;
        background-color:#FFFFFF;
}

.tree {min-height:200px; 
        margin:0 0 0 10px;
        border:1px solid #B8E2FB;
        background-color:#FFFFFF;
        padding-left: 1em;
        width: 300px;
        clear:both;
      	
 }

.clr {clear:both;}
#mon-tit{font-weight:bold; color:#0e9be7;}
#mon-tit .left{float: left;}
#mon-tit .right{float: right;}

#mon-dis {min-height:500px; font-size:14px;}
#mon-dis .title {float:left; background-color:#d7e2e8; font-weight:bold; width:100%}
#mon-dis .title span,  #mon-dis .ji span, #mon-dis .ou span {float:left; width: 10%; overflow:hidden;}

#mon-dis .title .name, #mon-dis .ji .name, #mon-dis .ou .name { width:20%;}
#mon-dis .title .url,  #mon-dis .ji .url, #mon-dis .ou .url {width:20%;} 
#mon-dis .ou {background-color:#e8f6ff; width: 100%;float:left;}

#mon-di {height:50px; font-size:14px;}
#mon-di .title {float:left; background-color:#d7e2e8; font-weight:bold; width:100%}
#mon-di .title span,  #mon-di .ji span, #mon-di .ou span {float:left; width: 10%; overflow:hidden}
#mon-di .title .name, #mon-di .ji .name, #mon-di .ou .name { width:20%;}
#mon-di .title .url,  #mon-di .ji .url, #mon-di .ou .url {width:20%;}
#mon-di .ou {background-color:#e8f6ff; width: 100%;float:left;}

.tit span{float:right; font-size:15px; }
.ji span, .ou span{   white-space: nowrap; border-bottom:1px solid #CCCCCC;}

#graph {min-height:450px; text-align:center; }

.flow-dis {min-height:300px; font-size:14px;}
.flow-dis .title {float:left; background-color:#d7e2e8; font-weight:bold; width:100%}
.flow-dis .title span,  .flow-dis .ji span, .flow-dis .ou span {float:left; width: 10%; overflow:hidden}
.flow-dis .title .tname, .flow-dis .ji .tname, .flow-dis .ou .tname { width:20%;}
.flow-dis .title .hid,  .flow-dis .ji .hid, .flow-dis .ou .hid {width:20%;} 
.flow-dis .ou {background-color:#e8f6ff; width: 100%;float:left;}

.listhost {
        min-height:220px; 
        margin:10px 0 10px 0;
        border:1px solid #B8E2FB;
        background-color:#FFFFFF;
        float:left;
        width:100%;
}

.listhost .host{
        display:inline;
        border:1px solid #D7E2E8;
        margin: 5px;
        float:left;
    }

.w1 {
    width: 33px;
    padding: 0 10px 0 6px;
    font-weight:bold;
    color:#45620A;
}

.w2 {
    font-weight:bold;
}

.w3{
    vertical-align: middle;
    padding:3px; 
    color:#303030;
}

.mon-info {
    padding:6px 0;
    border-bottom: 1px solid #DBE5EA;
}

.mon-info span{
    width:40%;
    display:inline-block;
}

.btn, .btn:visited { 
display: inline-block;
/*float:left;
margin:5px; */
padding: 4px 10px;
font:bold 13px/180% Tahoma, sans-serif;
color: #fff;
text-decoration: none;
overflow:hidden;
background: #222 url(sprites.png) repeat-x;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.25);
border-bottom: 1px solid rgba(0, 0, 0, 0.25);
cursor: pointer;
}
.btn:hover {
background-color: #111;
}
.btn:active {
top: 1px;
}
.blue, .blue:visited {
background-color: #2daebf;
}
.blue:hover {
background-color: #007d9a;
}

.page {margin-top:10px; text-align:center}
.page a {
    border: 1px solid #BBBBBB;
    margin-right: 1px;
    padding: 3px 4px;
}
.page .on {
    background-color: #2C4455;
    border: 1px solid #2C4455;
    color: #FFFFFF;
}

.block-info {
    border:1px solid #afafaf;
    background:#fff;
    padding:6px;
}

.actions {
    border-bottom: 1px solid #DDDDDD;
    border-top: 1px solid #FFFFFF;
    color: #999999;
    padding: 3px;
}


.button, input[type="submit"], input[type="button"], .submit-row input {
    -moz-border-bottom-colors: none;
    -moz-border-image: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background: url("/static/image/nav-bg.gif") repeat-x scroll center bottom white;
    border-color: #DDDDDD #AAAAAA #AAAAAA #DDDDDD;
    border-style: solid;
    border-width: 1px;
    color: black;
    padding: 3px 5px;
}


form select, form input[type="text"]{
    width:160px;
}

.open {
    text-decoration:underline;
}


.alert-user{
    float:left;
    padding-top:5px;
}

.floating {
    float:left;
    font-weight: normal;
    margin-left: 0;
    text-align: left;
    width: 200px;
}
